<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title th:text="${article.title}"></title>
</head>
<body>
<div>
    <!--文章头部信息： 标题 ，作者，最近更新日期，导航-->
    <h2 style="margin: auto 0" th:text="${article.title}"></h2>
    author: <span style="float: left" th:text="${article.author}"></span>
    <!--content-->
    <div id="doc-content">
        <textarea style="display: none" placeholder="markdown" th:text="${article.content}"></textarea>
    </div>
</div>

<link rel="stylesheet" th:href="@{/editor/css/editormd.preview.css}" />
<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<script th:src="@{/editor/lib/marked.min.js}"></script>
<script th:src="@{/editor/lib/prettify.min.js}"></script>
<script th:src="@{/editor/lib/raphael.min.js}"></script>
<script th:src="@{/editor/lib/underscore.min.js}"></script>
<script th:src="@{/editor/lib/sequence-diagram.min.js}"></script>
<script th:src="@{/editor/lib/flowchart.min.js}"></script>
<script th:src="@{/editor/lib/jquery.flowchart.min.js}"></script>
<script th:src="@{/editor/editormd.min.js}"></script>

<script type="text/javascript">
    var testEditor;
    $(function (){
        testEditor = editormd.markdownToHTML("doc-content",{
            //markdown        : markdown ,//+ "\r\n" + $("#append-test").text(),
            //htmlDecode      : true,       // 开启 HTML 标签解析，为了安全性，默认不开启
            htmlDecode      : "style,script,iframe",  // you can filter tags decode
            //toc             : false,
            tocm            : true,    // Using [TOCM]
            //tocContainer    : "#custom-toc-container", // 自定义 ToC 容器层
            //gfm             : false,
            //tocDropdown     : true,
            // markdownSourceCode : true, // 是否保留 Markdown 源码，即是否删除保存源码的 Textarea 标签
            emoji           : true,
            taskList        : true,
            tex             : true,  // 默认不解析
            flowChart       : true,  // 默认不解析
            sequenceDiagram : true,  // 默认不解析
            codeFold        : true
        });
    });

</script>
</body>
</html>
